<template>
  <details-layout :leftTitle="`通讯录好友(${num})`" @on-scroll-bottom='loadMore' :load-stop="loadStop">
    <div class="detail">
      <friends-list :data="friendsData" v-if="friendsData.length > 0"></friends-list>
      <span v-else class="tip-null">暂无数据</span>
    </div>
    <div class="loadDi" v-if="loadStop">
      ------&nbsp;我也是有底线的&nbsp;------
    </div>
  </details-layout>
</template>

<script>
  import DetailsLayout from '../../components/details-layout'
  import FriendsList from '../../components/friends-list'
  import request from '../../helper/request'

  export default {
    name: 'friends-block',
    components: {
      DetailsLayout,
      FriendsList
    },
    mixins: [],
    computed: {},
    props: {
      data: {
        type: Object,
        default() {
          return {}
        }
      }
    },
    data() {
      return {
        friendsData: [],
        friendsDataTemp: [],
        num: '',
        loadStop: false,
        page: {}
      }
    },
    methods: {
      /**
       * 加载更多
       */
      loadMore() {
        this.loadStop = false
        if (this.page.currPage < this.page.pageCount) {
          this.getQueryList(this.page.currPage + 1, 5)
        } else if (this.page.currPage) {
          this.loadStop = true
        }
      },
      getQueryList(currPage = 1, limit = 10) {
        let param = Object.assign({
          'sjh': '',
          'pageObj': {
            'currPage': currPage,
            'pageSize': limit,
            'pagination': '1'
          }
        }, this.$store.state.phone)
        request('superRecord/mobile/txlhy', 'SC0425', param).then(res => {
          this.num = res.pageResult.totalCount
          this.page = res.pageResult
          res.txlhy.map(resHY => {
            let _realName = resHY.sm.map(rsm => {
              return {
                name: rsm.xm,
                num: rsm.num
              }
            })
            let _identity = resHY.zssf.map(rzssf => {
              return {
                name: rzssf.xm,
                idcard: rzssf.sfzh,
                lab: rzssf.bs
              }
            })
            this.friendsData.push({
              name: resHY.hyxm,
              phone: resHY.sjhm,
              callNumber: resHY.tlcs,
              lastTime: resHY.zhtlsj,
              realName: _realName,
              identity: _identity
            })
          })
        }).catch(err => {
          this.$toast(err.msg)
        })
      }
    },
    watch: {},
    mounted() {
    },
    created() {
      this.getQueryList()
    }
  }
</script>

<style scoped lang="scss">
  .detail {
    padding: .5rem .2rem;
    > div > dl.list {
      margin-right: 1.2rem !important;
    }
  }

  .loadDi {
    text-align: center;
    padding: .5rem .2rem .8rem;
    color: #ccc;
  }
</style>
